<template>
	<view>
		<template v-if="diy">
			<!-- 自定义顶部导航切换卡 -->
			<view
				v-if="diy.navbar.display"
				class="global-navbar"
				:style="diy.navbar.background">
				<view
					:class="diy.navbar.hover==index?'global-navbar-for global-navbar-for-hover':'global-navbar-for'"
					v-for="(item, index) in diy.navbar.list" :key="index"
					@click="clickNavbarButton(index,item.name)">
					<view class="global-navbar-for-text">
						<view
							:style="diy.navbar.navbarTextStyle"
							class="global-navbar-for-text-name">
							{{item.name[$i18n.locale]}}
						</view>
						<view
							v-if="diy.navbar.hover == index"
							:style="diy.navbar.hoverStyle"
							class="global-navbar-for-text-hover"></view>
					</view>
				</view>
			</view>
			<view class="global-navbar-placeholder" v-if="diy.navbar.display"></view>
			<!-- 切换卡 diy 数据 -->
			<youransns-diy
				:youransnsConfig="diy.tabList[diy.navbar.hover]"
				v-if="youransnsDiyStatus"></youransns-diy>
		</template>
		<!-- 弹窗 头条推荐 -->
		<!-- #ifndef H5 -->
		<view
			class="global-bottom-to-top-pop-up"
			v-if="headlineRecommendationStatus">
			<view
				class="_top"
				@click="headlineRecommendationStatus = false"></view>
			<view class="_bottom">
				<view class="_title">
					<text class="_title-text">{{$t('contentRecommend')}}</text>
					<view @click="headlineRecommendationStatus = false"><text class="iconfont icon-close-bold"></text></view>
				</view>
				<view
					@click="clickHeadlineRecommendationButton(headlineRecommendation.url,headlineRecommendation.key)"
					class="global-bottom-to-top-pop-up-hot">
					<view class="_post-title">{{headlineRecommendation.title[$i18n.locale]}}</view>
					<view class="_post-time">{{headlineRecommendation.time}}</view>
					<view class="_post-content">{{headlineRecommendation.content[$i18n.locale]}}</view>
					<view class="_button">
						{{$t('contentViewOriginal')}}
					</view>
				</view>
			</view>
		</view>
		<!-- #endif -->
		<!-- 微信隐私弹窗 -->
		<!-- #ifdef MP-WEIXIN -->
		<public-privacy-popup></public-privacy-popup>
		<!-- #endif -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				diy:null,//diy配置文件
				youransnsDiyStatus:false,// 组件加载状态
				headlineRecommendation:null,//头条
				headlineRecommendationStatus:false,//头条显示状态
			}
		},
		onShow() {
			setTimeout(()=>{
				// 是否登录
				if(this.$_isLogin()){
					// 一些回调，查阅 DeveloperGuide.md
					if(
						uni.getStorageSync('editorPublishSuccess') ||
						uni.getStorageSync('noticePostDeleteSuccess'))
					{
						this.youransnsDiyStatus = false;
						this.getDiyConfig();
						uni.removeStorageSync('editorPublishSuccess');
						uni.removeStorageSync('noticePostDeleteSuccess');
					}
					// 是否有未读
					this.$_isNotification()
				}
			},200);
		},
		onLoad() {
			// app 检查更新
			// #ifdef APP-PLUS
			// uni.request({
			// 	url:this.$_configFile() + "checkVersion.json",
			// 	method:"GET",
			// 	success: (res) => {
			// 		if(res.data.latestVersion != plus.runtime.version){
			// 			uni.showModal({
			// 				title: '提示',
			// 				content: '有新版本是否更新？',
			// 				success: (ref) => {
			// 					if (ref.confirm) {
			// 						this.$_to('my/checkVersion')
			// 					}
			// 				}
			// 			});
			// 		}
			// 	}
			// })
			// #endif
			// 微信 | 小程序 | 更新检测
			// #ifdef MP-WEIXIN
			const updateManager = uni.getUpdateManager()
			updateManager.onCheckForUpdate(res => {
				if (res.hasUpdate) {
					uni.showModal({
						content: '新版本已经准备好，是否重启应用？',
						showCancel: false,
						confirmText: '确定',
						success: res => {
							if (res.confirm) {
								updateManager.onUpdateReady(res => {
									updateManager.applyUpdate()
								})
								updateManager.onUpdateFailed(res => {
									uni.showModal({
										content: '下载失败，请删除当前小程序后重新打开',
										showCancel: false,
										confirmText: '知道了'
									})
								})
							}
						}
					})
				}
			})
			// #endif
			uni.request({
				url: this.$_configFile() + "headlineRecommendation.json",
				success: (res) => {
					this.headlineRecommendation = res.data;
					if(res.data.switch){
						if(uni.getStorageSync('headlineRecommendation')){
							if(uni.getStorageSync('headlineRecommendation') != res.data.key){
								this.headlineRecommendationStatus = true;
							}
						}else{
							this.headlineRecommendationStatus = true;
						}
					}
				}
			})
			this.getDiyConfig();
		},
		methods: {
			getDiyConfig(){
				// 先判断是否开启了开发模式，开发模式是没有缓存的
				// 判断是否有缓存，有，读取缓存，没有，请求配置文件并且储存缓存
				if(this.$_developMode()){
					uni.request({
						url: this.$_configFile() + "diy_1.json",
						success: (res) => {
							this.diy = res.data;
							this.$nextTick(() => {
								this.youransnsDiyStatus = true;
							});
							uni.setNavigationBarTitle({
								title: this.diy.setNavigationBarTitle[this.$i18n.locale]
							});
						}
					})
				}else{
					if(uni.getStorageSync('diy_1_json')){
						this.diy = JSON.parse(uni.getStorageSync('diy_1_json'));
						this.$nextTick(() => {
							this.youransnsDiyStatus = true;
						});
						uni.setNavigationBarTitle({
							title: this.diy.setNavigationBarTitle[this.$i18n.locale]
						});
					}else{
						uni.request({
							url: this.$_configFile() + "diy_1.json",
							success: (res) => {
								uni.setStorageSync('diy_1_json', JSON.stringify(res.data));
								this.diy = res.data;
								this.$nextTick(() => {
									this.youransnsDiyStatus = true;
								});
								uni.setNavigationBarTitle({
									title: this.diy.setNavigationBarTitle[this.$i18n.locale]
								});
							}
						})
					}
				}
			},
			// 点击切换卡
			clickNavbarButton(index,name){
				uni.setNavigationBarTitle({title: name[this.$i18n.locale]});
				this.diy.navbar.hover = index;
				this.youransnsDiyStatus = false;
				this.$nextTick(() => {
					this.youransnsDiyStatus = true;
				});
			},
			// 点击头条
			clickHeadlineRecommendationButton(url, key){
				uni.setStorageSync('headlineRecommendation',key);
				this.headlineRecommendationStatus = false;
				this.$_to(url)
			}
		},
		// 微信分享
		onShareAppMessage(res) {
			return {
				title: uni.getSystemInfoSync().appName,
				path: '/pages/navigation/diy_1'
			}
		},
		// 分享到朋友圈
		onShareTimeline() {
			return {
				title: uni.getSystemInfoSync().appName,
				path: '/pages/navigation/diy_1'
			}
		},
		// 上拉加载事件
		onReachBottom() {
			uni.$emit('onReachBottom')
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.youransnsDiyStatus = false;
			this.getDiyConfig();
			this.$nextTick(() => {
				uni.stopPullDownRefresh();
			});
		}
	}
</script>

<style lang="scss">
.global-bottom-to-top-pop-up-hot{
	._post-title{
		font-size: 32rpx;
		line-height: 32rpx;
		font-weight: bold;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 1;
		overflow: hidden;
		margin: 25rpx 25rpx 0 25rpx;
		text-align: center;
	}
	._post-time{
		font-size: 28rpx;
		line-height: 28rpx;
		text-align: center;
		color: $placeholder;
		padding-top: 20rpx;
	}
	._post-content{
		font-size: 28rpx;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		margin: 15rpx 25rpx 0 25rpx;
		color: $placeholder;
	}
	._button{
		width: 50%;
		height: 70rpx;
		background: $theme;
		color: #FFF;
		margin: 20rpx auto;
		display: flex;
		align-items: center;
		justify-content: center;
		line-height: 28rpx;
		font-size: 28rpx;
		border-radius: 100rpx;
	}
}
</style>
